﻿<!DOCTYPE html>
<html>
<head>

	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
	<meta http-equiv="content-language" content="en" />
	<meta name="viewport" content="width=device-width, initial-scale=1"> 

	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
	<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js" type="text/javascript"></script>
	<script src="jquery.zrssfeed.min.js" type="text/javascript"></script>

	<link href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" rel="stylesheet" />

	<title>zRSSFeed - Displaying RSS feeds with jQuery Mobile</title>

	<style>
		.rssBody ul, .rssRow {
			margin-left: 0;
			padding-left: 0;
			list-style: none;
		}
		.rssRow h4 { margin: 0; font-size: 1.8em; letter-spacing: -1px; }
		.rssRow h4 a { text-decoration: none; }
		.rssRow h4 a:hover { color: darkblue; }
		.rssRow div { font-size: 0.9em; color: #999; }
		#zazar { color: #fff; }
	</style>

	<script type="text/javascript">
	$(document).ready(function () {
		$('#test').rssfeed('http://feeds.reuters.com/reuters/oddlyEnoughNews', {
			limit: 5
		});
	});
	</script>

</head>
<body>

<div data-role="page">

	<div data-role="header">
		<h1>zRSSFeed - Displaying RSS feeds with jQuery Mobile</h1>
	</div>

	<div data-role="content">	
		<p>Demonstrates displaying a feed with jQuery Mobile. This example is best viewed on mobile devices.</p>
		<div id="test"></div>
	</div>
	
	<div data-role="footer">
		<h4><a id="zazar" href="http://www.zazar.net/developers/jquery/zrssfeed/">Zazar zRSSFeed Plugin</a></h4>
	</div>
	
</div>

</body>
</html>